<extend name="Public/base"/>

<block name="body">
    <div class="main-title">
        <h2>新增优惠券</h2>
    </div>
    <div class="tab-wrap">
        <ul class="tab-nav nav">
            <li data-tab="tab1" class="current"><a href="#">基础</a></li>
            <li data-tab="tab2" ><a href="#">扩展</a></li>
        </ul>
        <div class="tab-content">
            <form action="{:U()}" method="post" enctype="multipart/form-data" class="form-horizontal">
                <div id="tab1" class="tab-pane tab1 in">
                    <div class="form-item">
                        <label class="item-label">类型</label>
                        <div class="controls">
                            <select name="couponstype" id="couponstype" class="select input-large"  onchange="display();">
                                <volist name='couponstype' id='ct'>
                                    <option value="{$i}">{$ct}</option>
                                </volist>
                            </select>
                        </div>
                    </div>
                    <div class="form-item" id="pardiv" style="display: block;">
                        <label class="item-label">金额</label>
                        <div class="controls">
                            <input type="text" class="text input-large" name="par" value="">
                        </div>
                    </div>
                    <div class="form-item" id="selectpardiv" style="display: none">
                        <label class="item-label">消费额度及优惠额度</label>
                        <div class="controls">
                            满
                            <input type="text" class="text input-large" name="consume" value="" style="width: 175px;">
                            减
                            <input type="text" class="text input-large" name="reduce" value="" style="width: 175px;">
                        </div>
                    </div>
                    <div class="form-item">
                        <label class="item-label">数量</label>
                        <div class="controls">
                            <input type="text" class="text input-large" name="cnt" value="">
                        </div>
                    </div>
                    <div class="form-item">
                        <label class="item-label">使用开始时间</label>
                        <div class="controls">
                            <input type="text" name="validityStartPeriod" class="text input-large time" value="" placeholder="请选择时间"  />
                        </div>
                    </div>
                    <div class="form-item">
                        <label class="item-label">使用结束时间</label>
                        <div class="controls">
                            <input type="text" name="validityEndPeriod" class="text input-large time" value="" placeholder="请选择时间" />
                        </div>
                    </div>
                    <div class="form-item">
                        <label class="item-label">领取开始时间</label>
                        <div class="controls">
                            <input type="text" name="receiveStartPeriod" class="text input-large time" value="" placeholder="请选择时间"  />
                        </div>
                    </div>
                    <div class="form-item">
                        <label class="item-label">领取结束时间</label>
                        <div class="controls">
                            <input type="text" name="receiveEndPeriod" class="text input-large time" value="" placeholder="请选择时间"  />
                        </div>
                    </div>
                    <div class="form-item">
                        <label class="item-label">上传图片</label>
                        <div class="controls">
                            <input type="file" name="couponsphoto" />
                        </div>
                    </div>
                </div>
                <div id="tab2" class="tab-pane tab2">
                    <div class="form-item cf">
                        <label class="item-label">领取条件<span class="check-tips">
                                <a href='#' class='btn btn-primary' id="addreceiveCondition">添加领取条件</a></span></label>
                        <div class="controls">
                            <div style="border: #000 1px solid; width: 50%" class='data-table table-striped'>
                                <table >
                                    <thead><tr>
                                            <th>领取条件</th>
                                            <th>操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="tbodyreceiveCondition">
                                        <tr>
                                            <td><input type="text" class="text input-8x" name="receiveCondition[]" value="" placeholder="输入领取条件" ></td>
                                            <td></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="form-item cf">
                        <label class="item-label">使用条件<span class="check-tips">
                                <a href='#' class='btn btn-primary' id="adduseCondition">添加使用条件</a></span></label>
                        <div class="controls">
                            <div style="border: #000 1px solid; width: 50%" class='data-table table-striped'>
                                <table >
                                    <thead><tr>
                                            <th>使用条件</th>
                                            <th>操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="tbodyuseCondition">
                                        <tr>
                                            <td><input type="text" class="text input-8x" name="useCondition[]" value="" placeholder="输入使用条件" ></td>
                                            <td></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="form-item">
                    <button class="btn submit-btn" id="submit" type="submit" target-form="form-horizontal">发布优惠券</button>
                    <button class="btn btn-return" onclick="javascript:history.back(-1);
                            return false;">返 回</button>
                </div>
            </form>
        </div>
    </div>
</block>

<block name="script">
    <link href="__STATIC__/datetimepicker/css/datetimepicker.css" rel="stylesheet" type="text/css">
    <php>if(C('COLOR_STYLE')=='blue_color') echo '<link href="__STATIC__/datetimepicker/css/datetimepicker_blue.css" rel="stylesheet" type="text/css">';</php>
    <link href="__STATIC__/datetimepicker/css/dropdown.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="__STATIC__/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript" src="__STATIC__/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
    <script type="text/javascript">
                        //导航高亮
                        highlight_subnav('{:U('Coupons / index')}');
                        $(function () {
                            $('.time').datetimepicker({
                                format: 'yyyy-mm-dd hh:ii:ss',
                                language: "zh-CN",
                                minView: 2,
                                autoclose: true
                            });
                        });

                        function display() {
                            if ($("#couponstype").val() == 1) {
                                $("#selectpardiv").css("display", "none");
                                $("#pardiv").css("display", "block");
                            } else {
                                $("#pardiv").css("display", "none");
                                $("#selectpardiv").css("display", "block");
                            }
                        }
                        $(document).ready(function () {
                            $(".tab-nav > li").click(function () {
                                var tab = $(this).data('tab');
                                $(".tab-nav > li").removeClass('current');
                                $(this).addClass('current');
                                $(".tab-pane").removeClass('in');
                                var obj = $('#' + tab);
                                obj.addClass('in');
                            });

                            $('#addreceiveCondition').click(function () {
                                var html = '<tr><td><input type="text" class="text input-8x" name="receiveCondition[]" value="" placeholder="输入领取条件" ></td><td><a href="#" class="btn btn-primary trdelreceiveCondition">删除</a></td></tr> ';
                                $('#tbodyreceiveCondition').append(html);
                                $('[data-form=select2]').select2();
                                $('.trdelreceiveCondition').bind("click", function () {
                                    $(this).parent().parent().remove();
                                });
                            });

                            $('#adduseCondition').click(function () {
                                var html = '<tr><td><input type="text" class="text input-8x" name="useCondition[]" value="" placeholder="输入使用条件" ></td><td><a href="#" class="btn btn-primary trdeluseCondition">删除</a></td></tr> ';
                                $('#tbodyuseCondition').append(html);
                                $('[data-form=select2]').select2();
                                $('.trdeluseCondition').bind("click", function () {
                                    $(this).parent().parent().remove();
                                });
                            });

                        });
    </script>
</block>
